var imgType;
(function (imgType) {
    imgType[imgType["pic"] = 0] = "pic";
    imgType[imgType["mp4"] = 1] = "mp4";
    imgType[imgType["text"] = 2] = "text";
})(imgType || (imgType = {}));
export class WorkSetting {
    constructor(title, edit, list = [], lineNum) {
        this.edit = false;
        this.list = [];
        this.lineNum = 15;
        this.title = title;
        this.edit = edit;
        this.list = list;
        if (lineNum) {
            this.lineNum = lineNum;
        }
    }
}
export function converList(list, key = "", data = []) {
    let _index = -1;
    let as = [];
    let _outData = [];
    list.filter((col, i) => {
        as.push([]);
        col.filter((row) => {
            if (row.key == key && key != "") {
                _index = i;
            }
            as[as.length - 1].push({
                value: row.value,
                width: row.width,
                height: row.height,
                left: row.left,
                top: row.top,
                merge: row.merge,
                key: row.key,
                index: row.index
            });
        });
    });
    if (_index > -1) {
        let f = list[_index];
        // let colsAdd = 0
        as.filter((col, i) => {
            _outData.push([]);
            if (i < _index) {
                col.filter(_f => {
                    _outData[_outData.length - 1].push(_f);
                });
            }
            else if (i == _index) {
                col.filter(_f => {
                    _outData[_outData.length - 1].push(_f);
                });
                for (let index = 0; index < data.length; index++) {
                    _outData.push([]);
                    const element = data[index];
                    f.filter(_f => {
                        let value = element[_f.key];
                        let _merge = [];
                        let _top = _f.top + (_f.height * (_outData.length - i - 1)) + (_outData.length - i - 1);
                        _f.merge.filter(mas => {
                            _merge.push([]);
                            mas.filter(ma => {
                                let _tempMa = ma;
                                _merge[_merge.length - 1].push([_outData.length - 1, _tempMa[1], _tempMa[2], _tempMa[3]]);
                            });
                        });
                        let outSideValue = {
                            value: value !== null && value !== void 0 ? value : "",
                            width: _f.width,
                            height: _f.height,
                            left: _f.left,
                            top: _top,
                            merge: _merge,
                            key: "",
                            index: [_outData.length - 1, _f.index[1]]
                        };
                        _outData[_outData.length - 1].push(outSideValue);
                    });
                }
            }
            else {
                col.filter(_f => {
                    let _top = _f.top + (_f.height * (_outData.length - 1 - i)) + (_outData.length - 1 - i);
                    let _merge = [];
                    _f.merge.filter(mas => {
                        _merge.push([]);
                        mas.filter(ma => {
                            let _tempMa = ma;
                            _merge[_merge.length - 1].push([_outData.length - 1, _tempMa[1], _tempMa[2], _tempMa[3]]);
                        });
                    });
                    let outSideValue = {
                        value: _f.value,
                        width: _f.width,
                        height: _f.height,
                        left: _f.left,
                        top: _top,
                        merge: _merge,
                        key: _f.key,
                        index: [_outData.length - 1, _f.index[1]]
                    };
                    _outData[_outData.length - 1].push(outSideValue);
                });
            }
        });
    }
    else {
        return list;
    }
    return _outData;
}
export class WorkModel {
    constructor(name = "", workSeting) {
        this.edit = false;
        this.mutipleChoose = false;
        this.saveList = [];
        this.lineNum = 15;
        this.showInputEle = document.createElement("div");
        this.mergeEles = [];
        this.pics = ["jpeg", "png", "jpg", "gif"];
        this.mp4s = ["mp4", "avi"];
        this.tableWidth = 0;
        this.allAxiosList = [];
        this.allEles = [];
        let element = this.bindEle(name);
        if (element) {
            this.elment = element;
            this.workSeting = workSeting;
            this.edit = workSeting.edit;
            this.elementRect = this.elment.getBoundingClientRect();
            this.saveList = workSeting.list;
            this.lineNum = workSeting.lineNum;
            this.joinSetting();
            if (workSeting.edit) {
                this.initEdit();
            }
        }
    }
    matrixTostring(matrixs) {
        let str = "";
        matrixs.forEach(item => {
            item.filter(_item => {
                str += _item.col.toString();
                str += _item.row.toString();
            });
        });
        return str;
    }
    bindEle(_ele) {
        let ele = document.querySelector(_ele);
        if (ele) {
            ele.style.width = "100%";
            ele.style.position = "relative";
            document.onkeydown = (ev) => {
                if (ev.key == "Control") {
                    this.mutipleChoose = true;
                }
            };
            document.onkeyup = (ev) => {
                if (ev.key == "Control") {
                    this.mutipleChoose = false;
                }
            };
            return ele;
        }
        else {
            console.log("fail,not find ele");
            return false;
        }
    }
    OutSideValueTostring(list) {
        let str = "[";
        list.filter(col => {
            str += "[";
            col.filter(row => {
                let _str = "{";
                if (row.merge.length < 1) {
                    _str += "width:" + row.width + ",";
                    _str += "height:" + row.height + ",";
                    _str += "left:" + row.left + ",";
                    _str += "top:" + row.top + ",";
                }
                else {
                    let width = 0;
                    let height = 0;
                    let top = 0;
                    let left = 0;
                    this.mergeEles.filter(v => {
                        let strs = this.matrixTostring(row.merge);
                        let _strs = this.matrixTostring(v.merge);
                        if (strs == _strs) {
                            width = v.width;
                            height = v.height;
                            top = v.top;
                            left = v.left;
                        }
                    });
                    _str += "width:" + width + ",";
                    _str += "height:" + height + ",";
                    _str += "left:" + left + ",";
                    _str += "top:" + top + ",";
                }
                _str += "key:" + `\"${row.key}\"` + ",";
                _str += "index:[" + row.index.toString() + "],";
                _str += "value:" + `\"${row.value}\"` + ",";
                _str += "merge:[";
                row.merge.filter(me => {
                    _str += "[";
                    me.filter(ma => {
                        _str += "[";
                        _str += ma.col + ",";
                        _str += ma.row + ",";
                        _str += ma.width + ",";
                        _str += ma.height + ",";
                        _str += "],";
                    });
                    _str += "],";
                });
                _str += "]},\n";
                str += _str;
            });
            str += "],";
        });
        str += "]";
        console.log(str);
    }
    crateInput(val = "") {
        // let inputBox = document.createElement("div")
        // inputBox.className = "inputBox"
        let subInputEle = document.createElement("input");
        subInputEle.className = "subInput";
        subInputEle.placeholder = val;
        // inputBox.appendChild(subInputEle)
        return subInputEle;
    }
    initEdit() {
        var _a, _b, _c;
        let mergerEle = document.createElement("div");
        mergerEle.innerText = "合并";
        mergerEle.className = "mergerEle";
        mergerEle.style.width = "100px";
        mergerEle.style.padding = "6px 3px";
        mergerEle.onclick = () => {
            let IndexStr = "";
            let ele = [];
            let AllEle = [];
            let compareStr = "";
            let matrixs = [];
            let _col = -1;
            this.allEles.filter(f => {
                if (f.ele.className.indexOf("choosed") > -1) {
                    if (ele.length == 2) {
                        ele[1] = f;
                    }
                    else {
                        ele.push(f);
                    }
                    AllEle.push(f);
                    if (_col == -1) {
                        matrixs.push([]);
                        _col = f.column;
                    }
                    if (_col != f.column) {
                        matrixs.push([]);
                        _col = f.column;
                    }
                    IndexStr += f.row.toString();
                    IndexStr += f.column.toString();
                    let _matrix = {
                        row: f.row,
                        col: f.column,
                        width: f.width,
                        height: f.height
                    };
                    matrixs[matrixs.length - 1].push(_matrix);
                }
            });
            if (ele.length > 1) {
                let first_row = ele[0].row;
                let first_col = ele[0].column;
                let second_row = ele[1].row;
                let second_col = ele[1].column;
                let domDOMRect = ele[0].ele.getBoundingClientRect();
                let width = 0;
                let height = 0;
                let _colI = 0;
                for (let col = first_col; col < second_col + 1; col++) {
                    height += this.allAxiosList[first_col][first_row].height + 8;
                    if (_colI > 0) {
                        height += 1;
                    }
                    _colI++;
                    for (let row = first_row; row < second_row + 1; row++) {
                        compareStr += row;
                        compareStr += col;
                    }
                }
                if (IndexStr != compareStr) {
                    console.log("merge table incorrect format");
                }
                else {
                    for (let row = first_row; row < second_row + 1; row++) {
                        let domrect = this.allAxiosList[first_col][row].ele.getBoundingClientRect();
                        width += domrect.width;
                    }
                    let left = 0;
                    for (let row = 0; row < matrixs[0][0].row; row++) {
                        left += this.allAxiosList[matrixs[0][0].col][row].width;
                    }
                    let positionEle = this.createposiEle(width - 1, height, domDOMRect.top - this.elementRect.top, left, matrixs);
                    this.posiStyleAdjusting();
                    // this.elment?.appendChild(positionEle)
                    AllEle.filter((_ele) => {
                        _ele.ele.className = "tableItem";
                        _ele.merge = matrixs;
                        _ele.top = domDOMRect.top - this.elementRect.top;
                        _ele.left = domDOMRect.left - this.elementRect.left;
                    });
                }
            }
            else if (ele.length == 1) {
                ele.filter(_e => {
                    _e.merge.filter(me => {
                        me.filter(item => {
                            this.allAxiosList[item.col][item.row].ele.className = "tableItem";
                            this.allAxiosList[item.col][item.row].merge = [];
                        });
                    });
                });
            }
            else {
                this.mergeEles.filter((ele, i) => {
                    if (ele.choosed) {
                        this.allEles.filter(f => {
                            if (this.matrixTostring(f.merge) == this.matrixTostring(ele.merge)) {
                                f.merge = [];
                                f.value = "";
                            }
                        });
                        ele.ele.remove();
                        this.mergeEles.splice(i, 1);
                    }
                });
            }
        };
        (_a = this.elment) === null || _a === void 0 ? void 0 : _a.appendChild(mergerEle);
        this.deterMind = document.createElement("div");
        this.deterMind.className = "deterMind";
        this.deterMind.innerText = "确定导出";
        this.deterMind.style.width = "100px";
        this.deterMind.style.padding = "6px 3px";
        this.deterMind.style.bottom = "60px";
        this.deterMind.onclick = () => {
            let ff = [];
            let saveSame = [];
            this.allAxiosList.filter(col => {
                ff.push([]);
                col.filter(row => {
                    if (row.merge.length > 0) {
                        let strs = this.matrixTostring(row.merge);
                        if (saveSame.indexOf(strs) == -1) {
                            saveSame.push(strs);
                            ff[ff.length - 1].push({
                                width: row.width,
                                height: row.height,
                                value: row.value,
                                left: row.left,
                                top: row.top,
                                merge: row.merge,
                                key: row.key,
                                index: [row.column, row.row],
                            });
                        }
                    }
                    else {
                        ff[ff.length - 1].push({
                            width: row.width,
                            height: row.height,
                            value: row.value,
                            left: row.left,
                            top: row.top,
                            merge: [],
                            key: row.key,
                            index: [row.column, row.row],
                        });
                    }
                });
            });
            this.OutSideValueTostring(ff);
        };
        let subShow = document.createElement("div");
        subShow.className = "subShowInput";
        let cancelButton = document.createElement("div");
        let confirmButton = document.createElement("div");
        let subButtonBox = document.createElement("div");
        subButtonBox.className = "subButtonBox";
        cancelButton.className = "subShowInputButton";
        confirmButton.className = "subShowInputButton";
        cancelButton.innerHTML = "取消";
        confirmButton.innerHTML = "确定";
        let subInputEle = this.crateInput(" 请赋值");
        let keyInputEle = this.crateInput(" 请赋值key");
        cancelButton.onclick = () => {
            this.showInputEle.style.display = "none";
        };
        confirmButton.onclick = () => {
            this.allEles.filter(f => {
                if (f.ele == this.clickEle) {
                    let _imgType = this.judgeInputType(subInputEle.value, f.ele);
                    if (_imgType == imgType.text) {
                        this.clickEle.innerText = subInputEle.value;
                    }
                    f.value = subInputEle.value;
                    f.key = keyInputEle.value;
                }
            });
            this.mergeEles.filter(f => {
                if (f.ele == this.clickEle) {
                    let _imgType = this.judgeInputType(subInputEle.value, f.ele);
                    if (_imgType == imgType.text) {
                        this.clickEle.innerText = subInputEle.value;
                    }
                    this.allAxiosList[f.merge[0][0].col][f.merge[0][0].row].value = subInputEle.value;
                    this.allAxiosList[f.merge[0][0].col][f.merge[0][0].row].key = keyInputEle.value;
                }
            });
            this.showInputEle.style.display = "none";
            this.clickEle = undefined;
            subInputEle.value = "";
        };
        subButtonBox.appendChild(confirmButton);
        subButtonBox.appendChild(cancelButton);
        subShow.appendChild(subInputEle);
        subShow.appendChild(keyInputEle);
        subShow.appendChild(subButtonBox);
        this.showInputEle.appendChild(subShow);
        this.showInputEle.className = "showInput";
        (_b = this.elment) === null || _b === void 0 ? void 0 : _b.appendChild(this.showInputEle);
        (_c = this.elment) === null || _c === void 0 ? void 0 : _c.appendChild(this.deterMind);
        document.oncontextmenu = () => {
            return false;
        };
    }
    judgeInputType(suffixs, parentEle) {
        let _temp = suffixs.toString();
        let _imgType = imgType.text;
        let spilt = _temp.split(".");
        if (spilt.length > 1) {
            let compare = spilt[spilt.length - 1];
            compare = compare.replace(/\s/g, "").replace(/[^a-zA-Z0-9]/g, "");
            for (let index = 0; index < this.pics.length; index++) {
                const element = this.pics[index];
                // console.log(compare.toLowerCase(), element, compare);
                if (element.indexOf(compare.toLowerCase()) > -1) {
                    let _img = document.createElement("img");
                    _imgType = imgType.pic;
                    _img.src = _temp;
                    parentEle.appendChild(_img);
                    break;
                }
            }
            for (let index = 0; index < this.mp4s.length; index++) {
                const element = this.mp4s[index];
                if (element.indexOf(compare.toLowerCase()) > -1) {
                    let _video = document.createElement("video");
                    _video.src = _temp;
                    _video.autoplay = true;
                    _video.controls = true;
                    parentEle.appendChild(_video);
                    _imgType = imgType.mp4;
                    break;
                }
            }
        }
        return _imgType;
    }
    createposiEle(width, height, top, left, matrixs, value = "") {
        var _a;
        let positionEle = document.createElement("div");
        positionEle.className = "posi";
        let _col = matrixs[0][0].col;
        positionEle.style.width = (width) + "px";
        if (value == "") {
            positionEle.style.height = height + "px";
        }
        // dealwotj posi
        positionEle.style.left = left + "px";
        positionEle.setAttribute("lines", matrixs.length.toString());
        matrixs.filter(col => {
            // col.filter(matrix => {
            //     this.allAxiosList[matrix.col][matrix.row].ele.setAttribute("lines", matrixs.length.toString())
            // })
            this.allAxiosList[col[0].col][0].ele.setAttribute("lines", matrixs.length.toString());
        });
        positionEle.onclick = (e) => {
            let classNames = e.target.className;
            if (classNames.indexOf("choosed") > -1) {
                e.target.className = classNames.replace("choosed", "");
                this.mergeEles[this.mergeEles.length - 1].choosed = false;
            }
            else {
                e.target.className += " choosed";
                // this.mergeEles[this.mergeEles.length - 1].choosed = true
                this.mergeEles.filter(f => {
                    if (f.ele == e.target) {
                        f.choosed = true;
                    }
                });
            }
            this.mergeEles.filter(ele => {
                if (ele.ele != e.target) {
                    ele.ele.className = "posi";
                    ele.choosed = false;
                }
            });
            this.allEles.filter(_f => {
                let originClass = _f.ele.className;
                _f.ele.className = originClass.replace("choosed", "");
            });
        };
        this.mergeEles.push({
            width: width,
            height: height,
            ele: positionEle,
            row: 0,
            column: 0,
            choosed: false,
            merge: matrixs,
            left: left,
            top: top,
            value: "",
            key: "",
        });
        positionEle.onmouseup = (e) => {
            if (e.button == 2) {
                this.clickEle = positionEle;
                this.showInputModel();
            }
        };
        (_a = this.allAxiosList[_col][0].ele.parentElement) === null || _a === void 0 ? void 0 : _a.appendChild(positionEle);
        return positionEle;
    }
    showInputModel() {
        this.showInputEle.style.display = "flex";
    }
    joinSetting() {
        var _a, _b;
        let _titleEle = document.createElement("div");
        _titleEle.className = "title";
        _titleEle.innerHTML = this.workSeting.title;
        _titleEle.style.height = "21px";
        (_a = this.elment) === null || _a === void 0 ? void 0 : _a.appendChild(_titleEle);
        this.tableEle = document.createElement("div");
        this.tableEle.className = "outTable";
        (_b = this.elment) === null || _b === void 0 ? void 0 : _b.appendChild(this.tableEle);
        this.tableWidth = this.tableEle.offsetWidth - (this.tableEle.offsetWidth % 10) - 120;
        this.tableEle.style.marginLeft = "120px";
        this.tableEle.style.marginTop = "20px";
        if (this.saveList.length == 0) {
            this.initTable(this.lineNum);
            this.genearteTable();
        }
        else {
            let maxNumber = this.parseTable();
            this.genearteTable();
            this.assginPosiEle(maxNumber);
            this.allPosiStyle();
        }
    }
    listTomatrix(list) {
        let matrixs = [];
        list.filter(item => {
            matrixs.push([]);
            // console.log("item",item);
            item.filter((_item) => {
                matrixs[matrixs.length - 1].push({
                    col: _item[0],
                    row: _item[1],
                    width: _item[2],
                    height: _item[3]
                });
            });
        });
        return matrixs;
    }
    parseTable() {
        // get line has number
        let maxNumber = 0;
        this.saveList.filter(col => {
            let lineNumber = 0;
            col.filter(row => {
                if (row.merge.length == 0) {
                    lineNumber += 1;
                }
                else {
                    row.merge = this.listTomatrix(row.merge);
                    lineNumber += row.merge[0].length;
                }
            });
            if (maxNumber < lineNumber) {
                maxNumber = lineNumber;
            }
        });
        this.initTable(maxNumber, this.saveList.length);
        return maxNumber;
    }
    assginPosiEle(maxNumber) {
        let coloccupy = [];
        // jedge addmerge
        this.saveList.filter(col => {
            let _f = {};
            for (let index = 0; index < maxNumber; index++) {
                _f[index] = -1;
            }
            coloccupy.push(_f);
        });
        this.saveList.filter((col, i) => {
            col.filter((row, j) => {
                if (row.merge.length > 0) {
                    // judge has cols
                    row.merge.filter((me, i) => {
                        me.filter(ma => {
                            coloccupy[ma.col][ma.row] = 0;
                            this.allAxiosList[ma.col][ma.row].merge = row.merge;
                            this.allAxiosList[ma.col][ma.row].ele.style.width = ma.width + "px";
                            this.allAxiosList[ma.col][ma.row].ele.style.height = ma.height + "px";
                            this.allAxiosList[ma.col][ma.row].width = ma.width;
                            this.allAxiosList[ma.col][ma.row].height = ma.height;
                        });
                        if (i == 0) {
                            this.allAxiosList[me[0].col][me[0].row].value = row.value;
                        }
                    });
                    let posiEle = this.createposiEle(row.width - 1, row.height, row.top, row.left, row.merge, row.value);
                    let _imgType = this.judgeInputType(row.value, posiEle);
                    if (_imgType == imgType.text) {
                        posiEle.innerText = row.value;
                    }
                }
                else {
                    let list = Object.keys(coloccupy[i]);
                    let _in = -1;
                    for (let index = 0; index < list.length; index++) {
                        const element = list[index];
                        if (coloccupy[i][element] == -1) {
                            _in = parseInt(element);
                            coloccupy[i][element] = 0;
                            break;
                        }
                    }
                    // console.log(coloccupy[i]);
                    this.allAxiosList[i][_in].ele.style.width = row.width + "px";
                    this.allAxiosList[i][_in].ele.style.height = row.height + "px";
                    //     let _imgType = this.judgeInputType(row.value, this.allAxiosList[i][lenJ].ele)
                    //     if (_imgType == imgType.text) {
                    //         this.allAxiosList[i][lenJ].ele.innerText = row.value
                    //     }
                    //     this.allAxiosList[i][lenJ].value = row.value
                    //     this.allAxiosList[i][lenJ].width = row.width
                    //     // this.allAxiosList[i][lenJ].height = row.height
                    // }
                }
            });
        });
    }
    initTable(lineNum = 10, colNumber = 1) {
        for (let colIndex = 0; colIndex < colNumber; colIndex++) {
            this.allAxiosList.push([]);
            for (let index = 0; index < lineNum; index++) {
                let _witdh = this.tableWidth / lineNum;
                let f = {
                    width: parseInt(_witdh.toString()),
                    ele: document.createElement('div'),
                    row: index,
                    column: colIndex,
                    height: 30,
                    choosed: false,
                    merge: [],
                    left: 0,
                    top: 0,
                    value: "",
                    key: "",
                };
                this.allAxiosList[this.allAxiosList.length - 1].push(f);
            }
        }
    }
    addTable(lineNum = 10, width) {
        // let new_List: EleWidth[][] = []
        this.singleEle = width;
        function add(tableWidth) {
            let _witdh = tableWidth / lineNum;
            let _ele = [];
            for (let index = 0; index < lineNum; index++) {
                if (width) {
                    _witdh = width;
                }
                let f = {
                    width: _witdh,
                    ele: document.createElement('div'),
                    row: index,
                    column: 0,
                    height: 30,
                    choosed: false,
                    merge: [],
                    left: 0,
                    top: 0,
                    value: "",
                    key: "",
                };
                _ele.push(f);
            }
            return _ele;
        }
        this.allAxiosList.push(add(this.tableWidth));
    }
    // colAddEle():HTMLDivElement{
    // }
    addEle() {
        let axiosAdd = document.createElement("div");
        axiosAdd.className = "add";
        axiosAdd.innerText = "+";
        axiosAdd.style.width = "25px";
        axiosAdd.style.height = "25px";
        axiosAdd.style.left = "-65px";
        axiosAdd.style.lineHeight = "25px";
        axiosAdd.onclick = (e) => {
            var _a;
            let _ele = e.target;
            // let row = _ele.getAttribute("row");
            let _width = ((_a = _ele.previousElementSibling) === null || _a === void 0 ? void 0 : _a.previousElementSibling).getBoundingClientRect().width;
            this.addTable(this.lineNum, _width);
            this.genearteTable();
            this.attionMergeEles();
        };
        return axiosAdd;
    }
    subtractionEle() {
        let subtrac = document.createElement("div");
        subtrac.className = "subtrac";
        subtrac.innerText = "-";
        subtrac.style.width = "25px";
        subtrac.style.height = "25px";
        subtrac.style.left = "-35px";
        subtrac.style.lineHeight = "25px";
        subtrac.onclick = (e) => {
            let row = e.target.getAttribute("row");
            this.delateEle(-1, parseInt(row));
            // this.genearteTable()
        };
        return subtrac;
    }
    delateEle(col = -1, row = -1) {
        var _a;
        if (((_a = this.tableEle) === null || _a === void 0 ? void 0 : _a.childNodes.length) > 1) {
            this.allAxiosList.splice(row, 1);
            this.genearteTable();
        }
    }
    genearteTable() {
        var _a;
        let listItem = [];
        this.tableEle.childNodes.forEach(i => {
            listItem.push(i);
        });
        for (let index = listItem.length - 1; index > -1; index--) {
            (_a = this.tableEle) === null || _a === void 0 ? void 0 : _a.removeChild(listItem[index]);
        }
        this.allEles.length = 0;
        this.allAxiosList.filter(row => {
            row.filter(f => {
                this.allEles.push(f);
            });
        });
        this.allAxiosList.filter((row, _rowIndex) => {
            var _a;
            let col = document.createElement("div");
            col.className = "col";
            row.filter((f, i) => {
                var _a;
                f.column = _rowIndex;
                f.ele.className = "tableItem";
                f.ele.style.width = ((_a = this.singleEle) !== null && _a !== void 0 ? _a : f.width) + "px";
                // f.ele.style.height = f.height + "px"
                f.ele.style.padding = "4px 0";
                f.ele.setAttribute("col", _rowIndex.toString());
                f.ele.setAttribute("row", i.toString());
                f.ele.onclick = (e) => {
                    let _col = parseInt(e.target.getAttribute("col"));
                    let _row = parseInt(e.target.getAttribute("row"));
                    console.log(_col, ",", _row);
                    if (f.ele.className.indexOf("choosed") > -1) {
                        let originClass = f.ele.className;
                        f.ele.className = originClass.replace("choosed", "");
                    }
                    else {
                        f.ele.className = f.ele.className + " choosed";
                    }
                    if (!this.mutipleChoose) {
                        this.allEles.filter(_f => {
                            if (f !== _f) {
                                let originClass = _f.ele.className;
                                _f.ele.className = originClass.replace("choosed", "");
                            }
                        });
                    }
                    this.mergeEles.filter(ele => {
                        ele.ele.className = "posi";
                        ele.choosed = false;
                    });
                };
                f.ele.onmouseup = (e) => {
                    if (e.button == 2) {
                        this.clickEle = f.ele;
                        this.showInputModel();
                    }
                };
                col.appendChild(f.ele);
            });
            if (this.edit && row.length > 0) {
                let subtrac = this.subtractionEle();
                subtrac.setAttribute("row", _rowIndex.toString());
                col.appendChild(subtrac);
            }
            if (this.edit && _rowIndex == 0) {
                let axiosAdd = this.addEle();
                axiosAdd.setAttribute("row", _rowIndex.toString());
                col.appendChild(axiosAdd);
            }
            (_a = this.tableEle) === null || _a === void 0 ? void 0 : _a.appendChild(col);
        });
        this.styleAdjusting();
    }
    styleAdjusting() {
        this.allAxiosList.filter(col => {
            col.filter(row => {
                if (row.ele.offsetHeight < row.height) {
                    row.ele.style.height = row.height + "px";
                }
            });
        });
    }
    posiStyleAdjusting() {
        let col = this.mergeEles[this.mergeEles.length - 1].merge[0][0].col;
        let row = this.mergeEles[this.mergeEles.length - 1].merge[0][0].row;
        let left = 0;
        for (let index = 0; index < row; index++) {
            let dOMRect = this.allAxiosList[col][row].ele.getBoundingClientRect();
            left += dOMRect.width;
        }
        this.mergeEles[this.mergeEles.length - 1].ele.style.left = left + "px";
    }
    allPosiStyle() {
        var _a;
        (_a = this.tableEle) === null || _a === void 0 ? void 0 : _a.childNodes.forEach(item => {
            let as = [];
            let height = 0;
            let lines = null;
            item.childNodes.forEach(_item => {
                as.push(_item);
                lines = _item.getAttribute("lines");
                if (lines == "2") {
                    return;
                }
                let rect = _item.getBoundingClientRect();
                if (rect.height > height) {
                    height = rect.height;
                }
            });
            if (lines && lines == "1") {
                as.filter(item => {
                    if (item.className == "posi") {
                        item.style.height = height + "px";
                    }
                    else if (item.className == "tableItem") {
                        item.style.height = height - 8 + "px";
                    }
                });
            }
        });
        this.mergeEles.filter(item => {
            let _col = item.merge[0][0].col;
            let _row = item.merge[0][0].row;
            let _rowEnd = item.merge[0][item.merge[0].length - 1].row;
            let _colEnd = item.merge[item.merge.length - 1][0].col;
            let left = 0;
            let width = 0;
            let height = 0;
            let _count = 0;
            for (let index = 0; index < _row; index++) {
                let dOMRect = this.allAxiosList[_col][index].ele.getBoundingClientRect();
                left += dOMRect.width;
            }
            _count = 0;
            for (let index = _row; index < _rowEnd + 1; index++) {
                let dOMRect = this.allAxiosList[_col][index].ele.getBoundingClientRect();
                width += dOMRect.width;
                if (_count == 0) {
                    width--;
                }
                _count++;
            }
            _count = 0;
            for (let index = _col; index < _colEnd + 1; index++) {
                let dOMRect = this.allAxiosList[index][0].ele.getBoundingClientRect();
                height += dOMRect.height;
                if (_count != 0) {
                    height += 1;
                }
                _count++;
            }
            item.ele.style.left = left + "px";
            item.ele.style.width = width + "px";
            item.ele.style.height = height + "px";
        });
    }
    attionMergeEles() {
        this.mergeEles.filter(i => {
            var _a;
            let _col = i.merge[0][0].col;
            (_a = this.allAxiosList[_col][0].ele.parentElement) === null || _a === void 0 ? void 0 : _a.appendChild(i.ele);
        });
        this.allPosiStyle();
    }
}
